<template>
  <el-form-item label="题目图片">
    <el-upload class="upload-demo" ref="upload" :on-success="csmwjimagesSubmitUploadSuccess"
      :on-remove="csmwjimagesSubmitRemoveSuccess" :action="param.baseurl+'/ajax/upload'" :file-list="value.value"
      :auto-upload="false">
      <template #trigger>
        <el-button size="small" type="primary">选取文件</el-button>
      </template>
      <el-button style="margin-left: 10px;" size="small" type="success"
        @click="csmwjimagesSubmitUpload">上传到服务器</el-button>
      <template #tip>
        <div class="el-upload__tip">
          只能上传 jpg/png 文件，且不超过 500kb
        </div>
      </template>
    </el-upload>
  </el-form-item>
</template>

<script>
  export default {
    props: {
      value: {
        type: Object,
        default: null
      },
    },
    data() {
      return {
        sp: {},
        sr: {},
        param: {
          baseurl: "",
        }
      }
    },
    created(options) {
      let that = this;
      that.xinit();
    },
    methods: {
      xinit() {
        let that = this;
        that.param.baseurl = this.$route.query.baseurl;
      },
      csmwjimagesSubmitUploadSuccess(res, file, filelist) {
        console.log('------------------', file.response.data.fullurl);
        this.activeData.csmwjimages.value.push({
          name: file.response.data.fullurl,
          url: file.response.data.fullurl
        });
      },
      // csmimages的images删除: csmwjimages.value的记录到filelist比较,如果不存在则说明被删除
      csmwjimagesSubmitRemoveSuccess(file, filelist) {
        for (let i = this.activeData.csmwjimages.value.length - 1; i >= 0; i--) {
          let item2 = this.activeData.csmwjimages.value[i];
          let found = false;
          filelist.forEach((item, index, array) => {
            if (item2.name == item.name) {
              found = true;
            }
          })
          if (found === false) {
            this.activeData.csmwjimages.value.splice(i, 1);
          }
        }
      },
      csmwjimagesSubmitUpload() {
        this.$refs.upload.submit();
      },
    }
  }
</script>

<style>

</style>
